<template>
  <div class="app-container">
    <div class="list">
      <div class="item" v-for="(item,index) in list.data" :key="index" @click="goMessage(item)">
        <span class="item-content">
         {{item.title}}
        </span>
        <span class="item-time">{{item.publishTime}}</span>
      </div>
    </div>
  </div>
</template>

<script>
import { system } from "@/api/message";
export default {
  data() {
    return {
      data:{},
      list:[]
    };
  },
  components: {},
  computed: {
    isMessage() {
      return this.$store.state.isMessage;
    }
  },
  mounted() {
    this.init();
  },
  methods: {
     goMessage(item){
      this.$router.push({
        path: '/message_content',
        query:{
          data:JSON.stringify(item)
        }
      })
      console.log(item)
    },
    init() {
      system().then(res => {
          this.list = res.data;
        })
        .catch(err => {
          console.log(err);
        });
    },
    closeDialog() {
      this.$store.commit("SET_ISMESSAGE", false);
    }
  }
};
</script>
<style lang="less" scoped>
.list {
  .item {
    padding: 10px 0 24px 0;
    border-bottom: 1px solid #eaeaea;
    cursor: pointer;
    span {
      display: block;
    }
    .item-content {
      font-size: 18px;
      text-align: justify;
    }
    .item-time {
      text-align: right;
      font-size: 16px;
      color: #a1a1a1;
    }
  }
}
</style>


